﻿{% extends "_layout.html" %}

{# 样式代码 #}
{% block style %}
    <link href="{{ ctx.app.config.staticUrl }}/css/index.css" rel="stylesheet" >
{% endblock %}

{# body代码#}
{% block body %}
    <!--container start-->
	<div class="container_reg">
		<div class="container">
			<div id="reg">
				<div class="title">填写个人详细信息</div>
				<div class="title-img"><img src="img/title.png"/></div>
				<div class="info" style="text-align: left;">为了能够尽量针对每个会员提供人性且周到的个人服务，让您感受到食艺道精心的个性化体验，请您务必在下列明细中填写您的真实资料。食艺道官方网站绝不对外透露您的任何隐私信息。</div>
				<div class="sex-style">
					<div class="fl sex">
						<div class="choose-box active fl">
							<input type="checkbox" class="checkBox" id="checkWoman" value="女" checked="checked"/>
							<label for="checkWoman"></label>
						</div>
						<div class="woman-img fl">
							
						</div>	
					</div>
					<div class="fl sex">
						<div class="choose-box fl">
							<input type="checkbox" class="checkBox" id="checkMan" value="男"/>
							<label for="checkMan"></label>
						</div>
						<div class="man-img fl">
							
						</div>	
					</div>
				</div>
				<form action="#" method="post" id="regFormInfo">
					<ul class="reg-list">
						<li>
							<div class="reg_input">
								<input type="text" name="userName" id="userName" placeholder="昵称" />
								<span>*</span>
							</div>
							<div class="reg-icon">
								<img src="img/right01.png"/>
							</div>
							<div class="prompt_info"></div>
						</li>
						<li>
							<div class="reg_input">
								<div class="reg_address fl">
									<select name="address" id="addressA">
										<option value="1">上海市</option>
									</select>
									<div class="dot-bottom"></div>
								</div>
								<div class="reg_address fl">
									<select name="address" id="addressB">
										<option value="1">徐汇区</option>
										<option value="2">静安区</option>
										<option value="3">黄浦区</option>
										<option value="4">长宁区</option>
									</select>
									<div class="dot-bottom"></div>
								</div>
								<input type="text" name="userAddres" id="userAddress" placeholder="详细地址" />
								<span>*</span>
							</div>
							<div class="reg-icon">
								<img src="img/right01.png"/>
							</div>
							<div class="prompt_info"></div>
						</li>
						<li>
							<div class="reg_input">
								<input type="text" name="userEmail" class="userEmail" id="userEmail" placeholder="邮箱" />
								<span>*</span>
							</div>
							<div class="reg-icon">
								<img src="img/right01.png"/>
							</div>
							<div class="prompt_info"></div>
						</li>
						<li>
							<div class="birthday fl">
								<select name="year" id="year" >
									<option value="1960">1960年</option>
									<option value="1961">1961年</option>
									<option value="1962">1962年</option>
									<option value="1963">1963年</option>
									<option value="1964">1964年</option>
									<option value="1965">1965年</option>
									<option value="1966">1966年</option>
									<option value="1967">1967年</option>
									<option value="1968">1968年</option>
									<option value="1969">1969年</option>
									<option value="1970">1970年</option>
									<option value="1971">1971年</option>
									<option value="1972">1972年</option>
									<option value="1973">1973年</option>
									<option value="1974">1974年</option>
									<option value="1975">1975年</option>
									<option value="1976">1976年</option>
									<option value="1977">1977年</option>
									<option value="1978">1978年</option>
									<option value="1979">1979年</option>
									<option value="1980">1980年</option>
									<option value="1981">1981年</option>
									<option value="1982">1982年</option>
									<option value="1983">1983年</option>
									<option value="1984">1984年</option>
									<option value="1985">1985年</option>
									<option value="1986">1986年</option>
									<option value="1987">1987年</option>
									<option value="1988">1988年</option>
									<option value="1989">1989年</option>
									<option value="1990">1990年</option>
									<option value="1991">1991年</option>
									<option value="1992">1992年</option>
									<option value="1993">1993年</option>
									<option value="1994">1994年</option>
									<option value="1995">1995年</option>
									<option value="1996">1996年</option>
									<option value="1997">1997年</option>
									<option value="1998">1998年</option>
									<option value="1999">1999年</option>
									<option value="2000">2000年</option>
									<option value="2001">2001年</option>
									<option value="2002">2002年</option>
									<option value="2003">2003年</option>
									<option value="2004">2004年</option>
									<option value="2005">2005年</option>
									<option value="2006">2006年</option>
									<option value="2007">2007年</option>
									<option value="2008">2008年</option>
									<option value="2009">2009年</option>
									<option value="2010">2010年</option>
									<option value="2011">2011年</option>
									<option value="2012">2012年</option>
									<option value="2013">2013年</option>
									<option value="2014">2014年</option>
									<option value="2015">2015年</option>
									<option value="2016">2016年</option>
									<option value="2017">2017年</option>
								</select>
							</div>
							<div class="birthday fl" style="margin: 0 38px;">
								<select name="month" id="month" >
									<option value="1">1月</option>
									<option value="2">2月</option>
									<option value="3">3月</option>
									<option value="4">4月</option>
									<option value="5">5月</option>
									<option value="6">6月</option>
									<option value="7">7月</option>
									<option value="8">8月</option>
									<option value="9">9月</option>
									<option value="10">10月</option>
									<option value="11">11月</option>
									<option value="12">12月</option>
								</select>
							</div>
							<div class="birthday fl">
								<select name="day" id="day" >
									<option value="1">1日</option>
									<option value="2">2日</option>
									<option value="3">3日</option>
									<option value="4">4日</option>
									<option value="5">5日</option>
									<option value="6">6日</option>
									<option value="7">7日</option>
									<option value="8">8日</option>
									<option value="9">9日</option>
									<option value="10">10日</option>
									<option value="11">11日</option>
									<option value="12">12日</option>
									<option value="13">13日</option>
									<option value="14">14日</option>
									<option value="15">15日</option>
									<option value="16">16日</option>
									<option value="17">17日</option>
									<option value="18">18日</option>
									<option value="19">19日</option>
									<option value="20">20日</option>
									<option value="21">21日</option>
									<option value="22">22日</option>
									<option value="23">23日</option>
									<option value="24">24日</option>
									<option value="25">25日</option>
									<option value="26">26日</option>
									<option value="27">27日</option>
									<option value="28">28日</option>
									<option value="29">29日</option>
									<option value="30">30日</option>
									<option value="31">31日</option>
								</select>
							</div>
						</li>
						<!--<li>
							<div class="keep-me-txt">The challenge is to help people understand this. The classics such as Arial, Helvetica, Verdana or Tahoma are engrained as fonts you will always expect toThe challenge is to help </div>
						</li>-->
						<!--<li>
							<input type="button" class="trs" name="login-btn" id="login-btn" value="DONE" />
						</li>-->
					</ul>
					<!--<div class="reg-con-info">
						The challenge is to help people understand this. The classics such as Arial, Helvetica, Verdana or Tahoma are engrained as fonts you will always expect toThe challenge is to help 
					</div>-->
					<div class="reg-line"></div>
					<!--口味选择-->
					<div class="taste_title">口味选择</div>
					<div id="taste">
						<div class="choose_taste fl">
							<div class="choose-box fl">
								<input type="checkbox" class="checkBox" id="checkBoxA" value="酸"/>
								<label for="checkBoxA"></label>
							</div>
							<div class="choose_txt">清淡</div>
						</div>
						<div class="choose_taste fl">
							<div class="choose-box fl">
								<input type="checkbox" class="checkBox" id="checkBoxB" value="甜" checked="checked" />
								<label for="checkBoxB"></label>
							</div>
							<div class="choose_txt">偏酸</div>
						</div>
						<div class="choose_taste fl">
							<div class="choose-box fl">
								<input type="checkbox" class="checkBox" id="checkBoxA" value="咸"/>
								<label for="checkBoxA"></label>
							</div>
							<div class="choose_txt">偏甜</div>
						</div>
						<div class="choose_taste fl">
							<div class="choose-box fl">
								<input type="checkbox" class="checkBox" id="checkBoxB" value="辣"/>
								<label for="checkBoxB"></label>
							</div>
							<div class="choose_txt">偏咸</div>
						</div>
						<div class="choose_taste fl">
							<div class="choose-box fl">
								<input type="checkbox" class="checkBox" id="checkBoxB" value="辣"/>
								<label for="checkBoxB"></label>
							</div>
							<div class="choose_txt">偏辣</div>
						</div>
						<div class="choose_taste fl" style="margin-top: 16px;">
							<div class="choose-box fl">
								<input type="checkbox" class="checkBox" id="checkBoxB" value="辣"/>
								<label for="checkBoxB"></label>
							</div>
							<div class="choose_txt">重辣</div>
						</div>
						<!--<div class="taste_more trs dot-right"></div>-->
					</div>
					<!--更多口味-->
					<!--<div class="taste_box">
						<div class="choose_taste fl">
							<div class="choose-box fl">
								<input type="checkbox" class="checkBox" id="checkBoxA" value="微酸"/>
								<label for="checkBoxA"></label>
							</div>
							<div class="choose_txt">微酸</div>
						</div>
						<div class="choose_taste fl">
							<div class="choose-box fl">
								<input type="checkbox" class="checkBox" id="checkBoxB" value="微甜"/>
								<label for="checkBoxB"></label>
							</div>
							<div class="choose_txt">微甜</div>
						</div>
						<div class="choose_taste fl">
							<div class="choose-box fl">
								<input type="checkbox" class="checkBox" id="checkBoxA" value="偏咸"/>
								<label for="checkBoxA"></label>
							</div>
							<div class="choose_txt">偏咸</div>
						</div>
						<div class="choose_taste fl">
							<div class="choose-box fl">
								<input type="checkbox" class="checkBox" id="checkBoxB" value="中辣"/>
								<label for="checkBoxB"></label>
							</div>
							<div class="choose_txt">中辣</div>
						</div>
						<div class="choose_taste fl">
							<div class="choose-box fl">
								<input type="checkbox" class="checkBox" id="checkBoxA" value="变态辣"/>
								<label for="checkBoxA"></label>
							</div>
							<div class="choose_txt">变态辣</div>
						</div>
						<div class="choose_taste fl">
							<div class="choose-box fl">
								<input type="checkbox" class="checkBox" id="checkBoxB" value="重辣"/>
								<label for="checkBoxB"></label>
							</div>
							<div class="choose_txt">重辣</div>
						</div>
					</div>-->
					<!--其他备注
					<div class="orther_note">
						<textarea name="ortherNote" id="ortherNote" rows="" cols=""></textarea>
					</div>-->
					<div class="reg-line"></div>
					<div class="have-account">感谢您的配合</div>
					<div class="reg-con-info">
						食艺道全体员工对于您的耐心和支持给予充分的肯定和感谢，并希望在不久的将来给予您最真诚的服务，开启全新的美食之旅。
					</div>
					<div class="create-account">
						<a href="javascript:void(0);" class="trs">完成注册</a>
						<div class="prompt_info"></div>
					</div>
				</form>
			</div>
		</div>
	</div>
	<!--container end-->
{% endblock %}
{#js代码#}
{% block js %}
    <script type="text/javascript" src="{{ ctx.app.config.staticUrl }}/js/index.js"></script>
	<script type="text/javascript" src="{{ ctx.app.config.staticUrl }}/js/regInfo.js"></script>
{% endblock %}